<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link href="../static/css/login.css" th:href="@{/css/login.css}" rel="stylesheet"/>
    <link rel="stylesheet" href="../static/css/iconfont.css" th:href="@{/css/iconfont.css}">
</head>    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<body>
<div class="container">
    <div class="form-box ">


        <form class="login-box loginPassword-box"  th:action="@{/login/loginPassword}" method="post" onsubmit="return dosubmit(this)">

            <h1>login</h1>

            <div class="password-login ">


                        <span>
                            <i class="iconfont emailL" style="left: 7px; top: 6px;">&#xe63e;</i>
                            <input type="text" placeholder="邮箱" class="input_txt input_txt1" style="width: 100%; position: relative; left: 5px;" name="email" th:value="${session.loginPasswordEmail} ?: ''">
                            <span id="resultEmail1"> </span>
                        </span><br>
                <span>
                            <i class="iconfont passwordL"  style="left: 7px; top: 5px;">&#xe69e;</i>
                            <input type="password" placeholder="密码" class="input_password" style="width: 100%; position: relative; left: 5px;" name="password" th:value="${session.loginPassword} ?: ''">
                            <span id="resultPassword1"> </span>
                            <div class="openEyes iconfont">&#xebcc;</div>
                         <div class="closeEyes iconfont">&#xebcd;</div>
                        </span><br>
<!--                <span class="remember-password"><input type="checkbox" id="remember" value="记住密码" th:checked="${savePassword == '1'}">-->
<!--                            <label for="remember"> 记住密码</label>-->

<!--                        </span>-->

                <a href="/forgetPassword" class="forget">忘记密码</a>

                <button class="button" type="submit">登录</button>
                <button class="toggle toggle-code go-to-register" type="button">去注册</button>
            </div>

        </form>



        <form class="login-box loginCode-box" th:action="@{/login/loginCode}" method="post" onsubmit="return dosubmit2(this)">

            <h1>login</h1>


            <div class="code-login">

    <span>
        <i class="iconfont emailL">&#xe63e;</i>
        <input type="text" placeholder="邮箱" class="input_txt input_txt2" name="email" th:value="${session.loginCodeEmail} ?: ''">
        <span id="resultEmail2"> </span>
    </span><br>
                <span class=" code-code-login  code-outer">
        <i class="iconfont">&#xe609;</i>
        <input type="text" placeholder="验证码" class="input_code" name="code" >
        <button class="get-code-login" id="get-code" onclick="sendCode(this.form.email.value,this)" type="button">获取验证码</button>
    </span><br>




                <button class="button code-login-button" style="    margin-top: 25px;">登录</button>
                <button class="toggle toggle-password go-to-register" type="button">去注册</button>
            </div>

        </form>



    </div>





    <div class="con-box left">
        <h2>探寻<span>慧问</span>之新旅</h2>
        <p>快来入驻<span>慧问</span>畅聊趣事吧</p>
        <img th:src="@{/img/name.png}" alt="">



        <button id="login">密码登录</button>

    </div>
    <div class="con-box right">
        <h2>探寻<span>慧问</span>之新程</h2>
        <p>快来入驻<span>慧问</span>探索新知吧</p>

        <img th:src="@{/img/logo.png}" alt="logo">
        <button id="register">验证码登录</button>


    </div>

    <div class="bookOuter">
        <img th:src="@{/img/书(Book)_爱给网_aigei_com.gif}" alt="书" class="book">
    </div>

</div>

<script th:inline="javascript">
    let email = [[${email}]];

    console.log(email)
let go_to_registers=document.getElementsByClassName('go-to-register')
    for(let i=0;i<go_to_registers.length;i++){
        go_to_registers[i].addEventListener('click',()=>{
            window.location.href = "http://localhost:8080/register";
        })
    }
    let errorMessage = [[${errorMessage}]];
    function showCustomAlert(message, duration) {
        let customAlert = document.getElementById('customAlert');
        if (!customAlert) {
            div_outter=document.createElement('div');
            customAlert = document.createElement('div');
            customAlert.id = 'customAlert';
            // customAlert.style.margin='7px 12px';
            const alertMessage = document.createElement('p');
            alertMessage.id = 'alertMessage';
            customAlert.appendChild(alertMessage);

            document.body.appendChild(customAlert);
        }

        const alertMessage = document.getElementById('alertMessage');

        alertMessage.textContent = message;
        if(alertMessage.textContent==null){
            customAlert.style.display = 'none';
        }

        customAlert.style.display = 'block';
        setTimeout(() => {
            customAlert.style.display = 'none';
        }, duration);
    }
    let loginError = [[${loginError}]];
    if (loginError && loginError !== '') {
        showCustomAlert(loginError, 3000);
    }
    function clearSessionData() {
        $.ajax({
            url: "/login/deleteSession",      // 后端接口路径
            method: "POST",             // 对应后端的 @PostMapping
            success: function(response) {
                console.log("Session 数据已清除");
console.log(response)
            },
            error: function(error) {
                console.error("清除 Session 失败:", error);

            }
        });
    }
    clearSessionData()
</script>

</body>

<script  src="../static/js/loginPassword.js" th:src="@{/js/loginPassword.js}"></script>
</html>